<template>
  <div>
    <el-form :model="form" :rules="rules" ref="formRef">
      <el-form-item label="商品名称" prop="name" :label-width="formLabelWidth">
        <el-input placeholder="请输入角色名称" :disabled="true" v-model="form.name"></el-input>
      </el-form-item>
      <el-form-item label="进货数量" prop="buyNumber" :label-width="formLabelWidth">
        <el-input-number
          type="number"
          :min="1"
          :precision="0"
          :step="1"
          controls-position="right"
          v-model="form.buyNumber"
        ></el-input-number>
        <!-- <el-input placeholder="请输入数量" type="number" v-model="form.buyNumber"></el-input> -->
      </el-form-item>
      <el-form-item label="备注" prop="remark" :label-width="formLabelWidth">
        <el-input type="textarea" :rows="3" placeholder="请填写备注" v-model="form.remark"></el-input>
      </el-form-item>
      <el-form-item :label-width="formLabelWidth">
        <el-button plain @click="resetForm('formRef')">取消</el-button>
        <el-button type="primary" @click="submitForm('formRef')">保存</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>
<script>
export default {
  name: "",
  data() {
    return {
      skuID:"",
      goodId: "",
      form: {
        name: "",
        buyNumber: "",
        remark: ""
      },
      formLabelWidth: "120px",
      rules: {
        buyNumber: [
          { required: true, message: "请输入进货数量", trigger: "blur" }
        ],
        remark: [
          {
            required: true,
            message: "请填写备注",
            trigger: "blur"
          }
        ]
      }
    };
  },
  props: ["data"],
  components: {},
  computed: {},
  beforeMount() {},
  mounted() {
    this.form.name = this.data.skuName;
    this.form.buyNumber = this.data.num;
    this.form.remark = this.data.remark;
    this.goodId = this.data.id;
    this.skuID =this.data.skuId;
  },
  methods: {
    submitForm(formName) {
      this.$refs[formName].validate(valid => {
        let message = this.form;
        if (valid) {
          let param = {
            skuId:this.skuID,
            id: this.goodId,
            num: message.buyNumber,
            remark: message.remark
          };
          console.log(param);
          this.$service.updatePurchase(param).then(res => {
            if (res.code == "00000") {
              this.$message({
                message: "修改成功",
                type: "success"
              });
              this.$refs[formName].resetFields();
              this.$emit("submit", false);
            } else {
              this.$message({
                message: res.message,
                type: "warning"
              });
            }
          });
        }
      });
    },
    resetForm(formName) {
      this.$emit("submit", false);
      this.$refs[formName].resetFields();
    }
  },
  watch: {}
};
</script>
<style scoped>
</style>